<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head th:fragment="head">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />
    
    <link href="resources/css/bootstrap.min.css" rel="stylesheet" th:href="@{/resources/bootstrap/css/bootstrap.min.css}"></link>
	<link rel="stylesheet" type="text/css" href="../../../../bootstrap/css/bootstrap-theme.min.css" th:href="@{/resources/bootstrap/css/bootstrap-theme.min.css}"></link>
	<link rel="stylesheet" type="text/css" href="../../../../bootstrap/css/bootstrapValidator.min.css" th:href="@{/resources/bootstrap/css/bootstrapValidator.min.css}"></link>
	<link rel="stylesheet" type="text/css" href="../../../../css/main.css" th:href="@{/resources/css/main.css}"></link>
	<link rel="shortcut icon" href="../../../../image/favicon.ico" th:href="@{/resources/image/favicon.ico}"></link>
    
    <!-- jQuery -->
	<script src="js/jquery.js" th:src="@{/resources/bootstrap/js/jquery.js}"></script>
	<!-- Bootstrap JavaScript -->
	<script src="js/bootstrap.min.js" th:src="@{/resources/bootstrap/js/bootstrap.min.js}"></script>

	<script src="js/bootstrapValidator.min.js" th:src="@{/resources/bootstrap/js/bootstrapValidator.min.js}"></script>
	<script src="js/customDashboard.js" th:src="@{/resources/js/customDashboard.js}" type="text/javascript"></script>
	
	<title th:text="#{view.index.title}">Main Dashboard</title>
	
	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
		<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
		<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
	
</head>
<body>

	<!-- Fixed navbar -->
	    <div th:fragment="headerNavigation (activeLink)" class="navbar navbar-default navbar-fixed-top" role="navigation">
	      <div class="container">
	        <div class="navbar-header">
	          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
	            <span class="sr-only">Toggle navigation</span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	          </button>
	          <a class="navbar-brand" href="#">
				<img th:src="@{/resources/image/logo.png}" src="../../image/logo.png" height="20" width="20"></img>
	          	<span th:text="#{head.title}">Balance Transfer Call</span>
	          </a>
	        </div>
	        <div class="navbar-collapse collapse" th:object="${session.sessionAccess}">
	          <ul class="nav navbar-nav">
	          	<span th:remove="tag" th:each="item : *{responseOpciones.abreviatura}">
	          		<div th:remove="tag" th:switch="${item.abreviatura}">
			            <li th:case="#{BTI_INI}" th:class="${activeLink=='dashboard'}?'active':''">
			            	<a href="#" th:href="@{/dashboard/}"><span th:text="#{head.home}">Home</span></a>
			            </li>	            	            
			            <li th:case="#{BTI_MON}" th:class="${activeLink=='monitor'}?'active':''">
			            	<a href="#" th:href="@{/transferVDN/monitor}"><span th:text="#{head.monitor}">Monitor</span></a>
			            </li>	          			
	          		</div>
	            </span>
	          </ul>
	          <ul class="nav navbar-nav navbar-right">
	            <li>
	            	<p class="navbar-text navbar-right">
	            		<i class="glyphicon glyphicon-user"></i>&nbsp;<span th:remove="tag" th:text="*{responseAcceso.nombre + ' ' + responseAcceso.paterno}">Felipe Castro</span>
	            	</p>
		        </li>
		        <li>
		        	<a href="#" class="navbar-link"><i class="glyphicon glyphicon-off"></i>
		        		<span th:text="#{sigin.logoff}">Cerrar Sesion</span>
		        	</a>
		        </li>
	          </ul>
	        </div><!--/.nav-collapse -->
	      </div>
	    </div>
	
</body>
</html>